<template>
  <header>
    <img alt="Vue logo" class="logo" src="./assets/logo.svg" width="125" height="125" />
    <div class="input-container">
      <input type="text" v-model="inputText" placeholder="请输入文字" />
      <div class="output-text">{{ inputText }}</div>
      <button @click="clearText">清空</button>
    </div>
  </header>
</template>

<script>
export default {
  data() {
    return {
      inputText: "" // 用于双向绑定输入框的内容
    };
  },
  methods: {
    clearText() {
      this.inputText = ""; // 清空输入框内容
    }
  }
};
</script>